<template>
  <view class="commonLim-list">
    <!-- 表单内容 -->
    <view class="form-content">
      <view class="form-item">
        <view>
          <text class="label" style="color: red">*</text>
          <text class="label">领料编号:</text>
        </view>
        <view>
          <text v-if="profile.pickNo" class="iptClass">{{
            profile.pickNo
          }}</text>
          <text class="dianwo" v-else>编号自动生成</text>
        </view>
      </view>
      <view class="form-item">
        <view>
          <text class="label" style="color: red">*</text>
          <text class="label">领料类型:</text>
        </view>
        <picker
          @change="bindPickerChange1"
          :value="pickerindex"
          :range="compickerlists"
          :disabled="editComp"
        >
          <view class="uni-input">
            <text v-if="compickerlists[pickerindex]">{{
              compickerlists[pickerindex]
            }}</text>
            <text class="dianwo" v-else>请选择领料类型</text>
          </view>
        </picker>
      </view>
      <view class="form-item">
        <view>
          <text class="label" style="color: red">*</text>
          <text class="label">领料人:</text>
        </view>
        <picker
          @change="bindPickerChange2"
          :value="pickerIdindex"
          :range="compickerIdlists"
          :disabled="editComp"
        >
          <view class="uni-input">
            <text v-if="compickerIdlists[pickerIdindex]">{{
              compickerIdlists[pickerIdindex]
            }}</text>
            <text class="dianwo" v-else>请选择领料人</text>
          </view>
        </picker>
      </view>
      <view class="form-item">
        <text class="label">备 注:</text>
        <input
          class="iptClass textright"
          placeholder="请输入备 注"
          v-model.trim="profile.remark"
          :disabled="editComp"
          style="width: 100%"
        />
      </view>
      <view class="form-item" style="align-items: center">
        <text class="label" style="margin-right: auto">领料要求 </text>
        <view style="display: flex">
          <button class="cancelClass" @click="choose">选择</button>
        </view>
      </view>
    </view>
    <view class="commonLim-listView">
      <view v-if="requirements.length">
        <view v-for="item in requirements" :key="item.id" class="listsssClass">
          <view class="wrapBox">
            <view class="smallBox">
              <text> 材质:</text>
              <text>{{ item.materialTypeName }}</text>
            </view>
            <view class="smallBox">
              <text> 规格型号: </text>
              <text>{{ item.specificationName }}</text>
            </view>
            <view class="smallBox">
              <text> 炉号:</text>
              <text>{{ item.heatNo }}</text>
            </view>
            <view class="smallBox">
              <view style="display: flex; align-items: center">
                <text style="margin-top: 2rpx">领取量:</text>
                <input
                  class="iptClass"
                  placeholder="请输入领料量"
                  type="number"
                  v-model.trim="item.quantity"
              /></view>
            </view>

            <view class="smallBox">
              <text> 单位:</text>
              <text>{{ item.unit }}</text>
            </view>
            <view class="smallBox">
              <text> 备注:</text>
              <text>{{ item.remark }}</text>
            </view>
          </view>
          <view class="yichu">
            <up-button
              type="error"
              text="移除"
              size="small"
              @click="handledelete(item)"
            ></up-button>
          </view>
        </view>
      </view>
      <up-empty mode="data" v-else> </up-empty>
    </view>
    <view class="dengjiClass">
      <button @click="onSubmit" class="commonClass">提 交</button>
    </view>
  </view>
</template>

<script setup>
import { addOrEditesaveRequisition, ClaimDetails, deleteDate1 } from "./api.js";
import { useMemberStore } from "@/stores/modules/member";
const memberStore = useMemberStore();
const deprops = defineProps(["title", "MaterialdetailsId"]);
const requirements = ref([]);
const editComp = computed(() => deprops.title == "编辑领料");
const handledelete = async (item) => {
  if (item.id) {
    await deleteDate1({
      ids: [item.id],
      deleteReason: "库存调整",
    });
  }
  requirements.value = requirements.value.filter((i) => i != item);
  uni.showToast({ icon: "success", title: "删除成功" });
};
//领料类型
const profile = ref({});
const pickerindex = ref(0);
const compickerlists = computed(() =>
  memberStore.pickTypeLists
    .filter((item) => item.value != 2)
    .map((item) => item.label)
);
const fengzuang = (num) => {
  const label = compickerlists.value[num];
  const obj = memberStore.pickTypeLists.find((item) => item.label == label);
  profile.value.pickType = obj ? obj.value : "";
  profile.value.pickTypeName = label;
};
const bindPickerChange1 = (e) => {
  pickerindex.value = e.detail.value;
  fengzuang(pickerindex.value);
  requirements.value = [];
  memberStore.lingliaoyaoqiu = [];
};
//领料类型
//领料人
const pickerIdindex = ref("");
const compickerIdlists = computed(() =>
  memberStore.saleslLists.map((item) => item.label)
);
const bindPickerChange2 = (e) => {
  pickerIdindex.value = e.detail.value;
  const label = compickerIdlists.value[e.detail.value];
  const obj = memberStore.saleslLists.find((item) => item.label == label);
  profile.value.pickerName = label;
  profile.value.pickerId = obj ? obj.value : "";
  console.log("picker发送选择改变，携带值为", profile.value.pickerId);
};
const choose = () => {
  if (profile.value.pickType === "") {
    return uni.showToast({
      icon: "none",
      title: "请选择领料类型",
    });
  }
  memberStore.lingliaoyaoqiu = requirements.value;
  uni.navigateTo({
    url: `/pages/wasteRegistration/wasteRegistration?pickType=${profile.value.pickType}`,
  });
};
// 点击保存提交表单
const onSubmit = async () => {
  try {
    if (!profile.value.pickType) {
      return uni.showToast({
        icon: "none",
        title: "领料类型不能为空",
      });
    }
    if (!profile.value.pickerId) {
      return uni.showToast({
        icon: "none",
        title: "领料人不能为空",
      });
    }
    if (!requirements.value.length) {
      return uni.showToast({
        icon: "none",
        title: "领料要求不能为空",
      });
    }
    if (deprops.title == "编辑领料") {
      if (requirements.value.length != 1) {
        return uni.showToast({
          icon: "none",
          title: "编辑时领料要求只能选择一条数据",
        });
      }
    }
    const flag = requirements.value.every((item) => item.quantity);
    if (!flag) {
      return uni.showToast({
        icon: "none",
        title: "领取量不能为空或0",
      });
    }
    uni.showLoading({
      title: "加载中",
    });
    profile.value.createBy = memberStore.userId;
    profile.value.orderById = memberStore.userId;
    profile.value.orderByName = memberStore.userName;
    requirements.value.forEach((item) => {
      item.createBy = memberStore.userId;
    });
    await addOrEditesaveRequisition({
      order: profile.value,
      requirements: requirements.value,
    });
    uni.showToast({ icon: "success", title: "操作成功" });
    uni.navigateBack({ delta: 1 });
  } finally {
    uni.hideLoading();
  }
};
onLoad(async () => {
  uni.setNavigationBarTitle({
    title: deprops.title,
  });
  memberStore.stateTable.rows = [];
  await Promise.all([
    memberStore.apiDictfnDetail("pick_type"),
    memberStore.salespersonListsfn(),
  ]);
  if (deprops.title == "新增领料") {
    requirements.value = [];
    fengzuang(pickerindex.value);
  } else {
    const res = await ClaimDetails(deprops.MaterialdetailsId);
    if (res) {
      profile.value = res.pickOrder || {};
      profile.value.pickType = profile.value.pickType + "";
      profile.value.pickerId = profile.value.pickerId + "";
      console.log(profile.value, "profile.valuessssssssssssss");
      const obj = memberStore.pickTypeLists.find(
        (item) => item.value == profile.value.pickType
      );
      profile.value.pickTypeName = obj ? obj.label : "";
      pickerindex.value = compickerlists.value.findIndex(
        (item) => item == profile.value.pickTypeName
      );
      pickerIdindex.value = compickerIdlists.value.findIndex(
        (item) => item == profile.value.pickerName
      );
      requirements.value = res.requirements || [];
    } else {
      profile.value = {};
      requirements.value = [];
    }
  }
});
//领料人
onShow(() => {
  memberStore.stateTable.rows.forEach((item) => {
    const objcurrent = requirements.value.find(
      (list) => list.selectedMaterialId == item.id
    );
    if (!objcurrent) {
      const obj = {
        selectedMaterialId: item.id,
        materialTypeName: item.materialTypeName,
        specificationName: item.specificationName,
        heatNo: item.heatNo,
        quantity: "",
        unit: item.unit,
        remark: item.remark,
      };
      if (profile.value.pickType == 1) {
        obj.materialCode = item.materialCode;
      }
      requirements.value.push(obj);
    }
  });
});
</script>

<style lang="scss" scoped>
</style>
